<template>
  <div>
    <pt-search
      :params="params"
      :config="config"
      position="top"
      @search="search"/>
    <pt-table
      :params="params"
      :columns="columns"
      :dataSource="tableData"
      :options="options"
      :fetch="getTableList"
      :pagination="pagination"
    />
  </div>
</template>

<script>
var typeList = [
  { name: '商家相册', value: 1 },
  {name: '运费模板', value: 2 },
  { name:'商品详情模板', value: 3 },
]
import * as api from "@/api/sc_shop"
import shopMsg from "./components/shopMsg"
import actList from "./components/actList"
import order from "./components/order"
export default {
  components: { shopMsg, actList, order },
  data() {
    return {
       config: [ // 搜索配置
        { key: "agentIds", type: "agentList", label: "区域" },
        { key: "businessName", type: "input", label: "商家名称", placeholder: "请输入商家名称" },
        { key: "businessMobile", type: "input", label: "商家电话", placeholder: "请输入商家电话" },
        { key: "usermobile", type: "input", label: "商家ID", placeholder: "请输入商家ID" },
        { key: "page", type: "button",
          group: [
            { name: "查看", type: "primary", onClick: () => { } },
            { name: "重置", type: "info", onClick: () => this.reset() },
            { name: "新增商家", type: "primary", plain: true, onClick: () => this.$router.push('/main/sc_shop/addShop') }
          ]
        }
      ],
      columns: [ // 表单配置
        {
           label: "商家信息", minWidth: 300, align: "left",
           render: row => {
            return <shop-msg item={row} />;
          }
        },
        {
          label: "订单", minWidth: 180, align: "left",
          render: row => {
            return <order item={row} />;
          }
        },
        {
          label: "活动", minWidth: 180, align: "left",
          render: row => {
            return <act-list item={row} />;
          }
        },
        { label: "月销量", minWidth: 100, align: "left", prop: '' },
        { label: "月营业额", minWidth: 100, align: "left", prop: '' },
        { button: true, label: "操作", width: 160, align: "right", fixed: 'right',
          group: [
            {
              name: "商家设置", type: "text", isOption: true, style: {},
              optionsBtn: typeList, onClick: (row, index, value) => this.handleClickList(row, value)
            },
            { name: "查看/编辑", type: "text", style:{color: 'rgb(33, 150, 243)', marginLeft: '20px'}, onClick: row => this.handleClick(row.id) }
          ]
        }
      ],
      pagination: { total: 0, page: 0, size: 10, curPage: 1 }, // 分页
      options: { // 表单外观
        mutiSelect: false, //  多选则 mutiSelect
        index: false, // 显示序号
        loading: false, // 表格动画
        initTable: true // 是否一挂载就加载数据
      },
      tableData: [], //表单数据
      curOrderlist: {}, //修改 选择数据
     
      params: {
        page: 0,
        size: 10,
        agentIds: [], //区域
        businessname: "", // 商家名称
        usermobile: "", // 用户手机号
        ordercode: "", // 订单号
        selectOrderTime: "", // 下单时间
        selectOrderStatus: "" // 订单状态
      },
      diyLoading: true, //自定义等待
      dialogTableVisible: false
    };
  },
  methods: {
    search() { // 搜索
      this.pagination.curPage = 1;
      this.pagination.page = 0;
      this.getTableList();
    },
    reset() { // 重置
      this.pagination.curPage = 1;
      for (const key in this.params) {
        if (key === "page") {
          this.pagination.page = 0;
        } else if (key === "size") {
          this.pagination.size = 10;
        } else if (key === "agentIds") {
          this.params[key] = [];
        } else {
          this.params[key] = "";
        }
      }
      this.getTableList();
    },
    handleClick(id) { //查看/修改订单操作
      this.$router.push({
        path: '/main/sc_shop/addShop',
        query: { id }
      })
    },
    handleClickList(row, type) { // 商家设置
      const id = row.id
      this.$router.push({
        path: type === 1? '/main/photo': type === 2 ? '/main/sc_shop/goodsDelivery':type === 3? '/main/sc_shop/goodsDisc': '',
        query: { id }
      })
    },
    getTableList() { //获取订单数据
      this.options.loading = true
      const params = {...this.params }
      params.page = this.pagination.page
      params.size = this.pagination.size
      params.agentIds = params.agentIds.length > 0 ? params.agentIds.join(",") : ""
      api.busList(params).then(res => {
        if (res.success) {
          this.tableData = res.data.list
          this.pagination.total = res.data.total
        }
      }).finally(() => { this.options.loading = false })
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
